$(document).ready(function() {
    $.getJSON("/sensorlist.php", function(data) {
        var table = "";
        $.each(data.array_token, function(v, k){
            table += '<option data-device-token="'+data.array_token[v]+'">'+data.array_name[v]+'</option>';
        });
        $("#device-select-chart").html(table);
        $("#device-select-table").html(table);
    });

    $("#chart-submit").click(function() {
        var k = $('#device-select-chart option:selected').data('device-token');
        var myDate = new Date(); 
        var date = myDate.getFullYear()+'-'+(myDate.getMonth()+1)+'-'+myDate.getDate();
        var obj = {query:"range_data_all", token:k, date_1:"2014-01-01", date_2:date};
        $.getJSON("/query.php", obj, function(data) {
            if (data.check == 'Not Found') {
                alert('No data found.');
            } else {
                $('#chart-container').empty();
                for(var temp = 0; temp < data.count; temp++) {
                    $('#chart-container').append('<div id="graph' + temp + '"></div>');
                    generate_chart(temp, data, data.array_name[temp]);
                }
            }
        });
    });

    $("#table-submit").click(function() {
        var k = $('#device-select-table option:selected').data('device-token');
        var obj = {query:"range_data_all", token:k, date_1:$("#StartDate").val(), date_2:$("#EndDate").val()};
        $.getJSON("/query.php", obj, function(data) {
            if (data.check == 'Not Found') {
                alert('No data found.');
            } else {
                $('#table-container').empty();
                for(var temp = 0; temp < data.count; temp++){	
                    $('#table-container').append('<h3>'+data.array_name[temp]+'</h3><table id="table'+temp+'" style="border:1px solid lightblue" class="table table-striped table-hover"></table>');
                    generate_table(temp, data, data.array_name[temp]);
                }
            }
        });
    });
});

function generate_table(id, data, name) {
    var table = '<thead><tr><td width="50%">Time</td><td>Value ('+data.array_unit[name][0]+')</td></tr></thead><tbody>';
    $.each(data.array_data[name], function(v, k) {
        table+='<tr><td>'+get_date(data.array_time[name][v])+'</td><td>'+data.array_data[name][v]+"</td></tr>";
    });
    table+="</tbody>";
    $("#table"+id).html(table);
}

function generate_chart(id, data, name){
    $('#graph'+id).highcharts('StockChart', {
        rangeSelector: {
            inputDateFormat: '%Y-%m-%d'
        },
        title: {
            text : name + ' of Device ' + $('#device-select-chart option:selected').html()
        },
        series: [{
            name : name,
            data : merge_time_date(data.array_time[name], data.array_data[name]),
        }],
        tooltip: {
            valueDecimals: 2,
            valueSuffix: data.array_unit[name][0],
            xDateFormat: '%Y-%m-%d %H:%M:%S'
        }
    });
};


function get_date(timestamp) {
    return (new Date(parseInt(timestamp)).toLocaleString("zh-Hans-CN", {hour12:false}));
}

function merge_time_date(time, date) {
    ret = [];
    for (var i = 0; i != time.length; i++) {
        ret[i] = [time[i], date[i]];
    }
    return ret;
}
